import { useEffect, useState, useRef } from "react";
import { Input, TextArea, Radio, Toast, Checkbox } from "antd-mobile";
import { AddOutline, CloseOutline, UploadOutline, TextOutline } from 'antd-mobile-icons';
import dayjs from "dayjs";
import { useNavigate, useSearchParams } from "react-router-dom";
import Styles from "./index.module.less";
import CalendarPopup from '@/components/CalendarPopup'
import DatePopup from '@/components/DatePopup'
import { getHandleInfo, uploadFile, negotiationAdd } from '@/service/projectDetail'
import { randomRangeId } from "@/utils/commonUtils"

const Index: React.FC<any> = () => {
    const [search] = useSearchParams();
    const searchId = search?.get('id')
    const infoId = search?.get('infoId')
    const governmentContacts = search?.get('governmentContacts')
    const governmentContactsPhone = search?.get('governmentContactsPhone')
    const jointContacts = search?.get('jointContacts')
    const jointContactsPhone = search?.get('jointContactsPhone')
    const jointContactsPost = search?.get('jointContactsPost')
    const navigate = useNavigate();
    const [params, setParams] = useState<any>({
        jointType: 3,
        jointDate: '',
        jointItem: '',
        governmentContacts: governmentContacts || '',
        governmentContactsPhone: governmentContactsPhone || '',
        jointContacts: jointContacts || '',
        jointContactsPhone: jointContactsPhone || '',
        jointContactsPost: (jointContactsPost && jointContactsPost != 'null') ? jointContactsPost : '',
        isJointLeader: '',
        isSecretProject: '',
        nextStep: '',
        registerType: '',
        settledType: '',
        spaceSize: '',
        creditCode: '',
        stopReason: '',
        jointStatus: '',
        enteringOffice: null,
        productionOperation: null,
        natong: null
    });
    const changeParams = (val: any, key: string) => {
        setParams((value: any) => {
            value[key] = val
            return { ...value }
        })
    }
    const [CalendarPopupVis, setCalendarPopupVis] = useState(false)
    const [CalendarTime, setCalendarTime] = useState('')
    const showPopup = (status: any) => {
        setCalendarPopupVis(status)
    }
    const enterDate = (e: any) => {
        let date: any = dayjs(e).format('YYYY-MM-DD')
        setCalendarTime(date)
    }
    const [expectSettleVis, setExpectSettleVis] = useState(false)
    const [expectSettleTime, setExpectSettleTime] = useState('')
    const showExpectSettlePopup = (status: any) => {
        setExpectSettleVis(status)
    }
    const enterExpectSettle = (e: any) => {
        let date: any = dayjs(e).startOf('month').format('YYYY-MM')
        setExpectSettleTime(date)
    }
    const changeNext = (e: any) => {
        setParams((value: any) => {
            value.nextStep = e
            value.jointStatus = []
            value.enteringOffice = null
            value.productionOperation = null
            return { ...value }
        })
    }
    const changeRegtype = (e: any) => {
        setParams((value: any) => {
            value.registerType = e
            return { ...value }
        })
    }
    const changeNoRegtype = (e: any) => {
        setParams((value: any) => {
            value.settledType = e
            return { ...value }
        })
    }
    const [settleVis, setSettleVis] = useState(false)
    const [settleTime, setSettleTime] = useState('')
    const showSettlePopup = (status: any) => {
        setSettleVis(status)
    }
    const enterSettle = (e: any) => {
        let date: any = dayjs(e).format('YYYY-MM-DD')
        setSettleTime(date)
    }
    const [houseVis, setHouseVis] = useState(false)
    const [houseTime, setHouseTime] = useState('')
    const showHouseTimePopup = (status: any) => {
        setHouseVis(status)
    }
    const enterHouse = (e: any) => {
        let date: any = dayjs(e).format('YYYY-MM-DD')
        setHouseTime(date)
    }
    let [uploadFileList, setUploadFileList] = useState<any>([]);
    const upLoadRef = useRef<any>(null);
    const inputUploadFile = (e: any) => {
        let fileReader = new FileReader();
        let id = randomRangeId(9)
        fileReader.onload = function () {
            const getUploadData = async () => {
                let formData = new FormData();
                formData.append("file", e.target.files[0]);
                let res: any = await uploadFile(formData)
                let { data } = res
                if (/^(http|https):\/\//.test(data)) {
                    setUploadFileList((list: any) => {
                        list.push({ name: e.target.files[0].name, url: data, id })
                        upLoadRef.current.value = '';
                        return [...list]
                    })
                } else {
                    upLoadRef.current.value = '';
                    return Toast.show({ content: "上传失败" })
                }
            }
            getUploadData()
        }
        // base64方式读取
        fileReader.readAsDataURL(e.target.files[0]);
    };
    const deleteUploadItem = (item: any) => {
        setUploadFileList((list: any) => {
            for (let i = list.length - 1; i >= 0; i--) {
                if (list[i].name == item.name && list[i].id == item.id) {
                    list.splice(i, 1)
                }
            }
            upLoadRef.current.value = '';
            return [...list]
        })
    }
    //市领导
    let [cityLeaders, setCityLeaders] = useState({
        add: true,
        tags: [],
        value: '',
    })
    //区领导
    let [districtLeaders, setDistrictLeaders] = useState({
        add: true,
        tags: [],
        value: '',
    })
    //局领导
    let [bureauLeaders, setBureauLeaders] = useState({
        add: true,
        tags: [],
        value: '',
    })
    const blurLeaders = (key: any) => {
        let funcObj = {
            city: setCityLeaders,
            district: setDistrictLeaders,
            bureau: setBureauLeaders
        }
        funcObj[key]((params: any) => {
            if (params.value && params.tags.indexOf(params.value) == -1) {
                params.tags.push(params.value)
            }
            params.add = true
            params.value = ""
            return { ...params }
        })
    }
    const deleteLeaders = (item: any, key: any) => {
        let funcObj = {
            city: setCityLeaders,
            district: setDistrictLeaders,
            bureau: setBureauLeaders
        }
        funcObj[key]((params: any) => {
            for (let i = params.tags.length - 1; i >= 0; i--) {
                if (params.tags[i] == item) {
                    params.tags.splice(i, 1)
                }
            }
            return { ...params }
        })
    }
    const showTagsInput = (key: any) => {
        let funcObj = {
            city: setCityLeaders,
            district: setDistrictLeaders,
            bureau: setBureauLeaders
        }
        funcObj[key]((params: any) => {
            params.add = false
            return { ...params }
        })
    }
    const changeTagInput = (val: any, key: any) => {
        let funcObj = {
            city: setCityLeaders,
            district: setDistrictLeaders,
            bureau: setBureauLeaders
        }
        funcObj[key]((params: any) => {
            params.value = val
            return { ...params }
        })
    }
    const getHandleInfoData = async () => {
        const res: any = await getHandleInfo(infoId)
        const { code, data } = res?.data
        if (code == 0) {
            let {
                jointDate,
                jointItem,
                governmentContacts,
                governmentContactsPhone,
                jointContacts,
                jointContactsPhone,
                jointContactsPost,
                isJointLeader,
                isSecretProject,
                nextStep,
                expectSettledTime,
                registerType,
                settledType,
                spaceSize,
                settledBuyHouseTime,
                supportProveAnnexName,
                supportProveAnnexUrl,
                creditCode,
                stopReason,
                jointLeader1,
                jointLeader2,
                jointLeader3,
                jointStatus
            } = data;
            setParams((value: any) => {
                value.jointItem = jointItem
                value.governmentContacts = governmentContacts
                value.governmentContactsPhone = governmentContactsPhone
                value.jointContacts = jointContacts
                value.jointContactsPhone = jointContactsPhone
                value.jointContactsPost = jointContactsPost
                value.isJointLeader = isJointLeader || 0
                value.isSecretProject = isSecretProject || 0
                value.nextStep = nextStep
                value.registerType = registerType || 2
                value.settledType = settledType || 1
                value.spaceSize = spaceSize || ''
                value.creditCode = creditCode || ''
                value.stopReason = stopReason || ''
                value.jointStatus = jointStatus?.split(',') || '',
                value.natong = jointStatus?.indexOf('19') > -1 ? 19 : jointStatus?.indexOf('20') > -1 ? 20 : null
                value.productionOperation = jointStatus?.indexOf('17') > -1 ? 17 : jointStatus?.indexOf('18') > -1 ? 18 : null
                value.enteringOffice = jointStatus?.indexOf('15') > -1 ? 15 : jointStatus?.indexOf('16') > -1 ? 16 : null
                return { ...value }
            })
            jointLeader1 && setCityLeaders((value: any) => {
                value.tags = jointLeader1.split(',')
                return { ...value }
            })
            jointLeader2 && setDistrictLeaders((value: any) => {
                value.tags = jointLeader2.split(',')
                return { ...value }
            })
            jointLeader3 && setBureauLeaders((value: any) => {
                value.tags = jointLeader3.split(',')
                return { ...value }
            })
            jointDate && setCalendarTime(jointDate)
            expectSettledTime && setExpectSettleTime(expectSettledTime)
            if (settledBuyHouseTime) {
                setSettleTime(settledBuyHouseTime)
                setHouseTime(settledBuyHouseTime)
            }
            if (supportProveAnnexName && supportProveAnnexUrl) {
                supportProveAnnexName = supportProveAnnexName.split(',')
                supportProveAnnexUrl = supportProveAnnexUrl.split(',')
                let FileListData = supportProveAnnexName.map((item: any, index: any) => {
                    return {
                        name: item,
                        url: supportProveAnnexUrl[index],
                        id: randomRangeId(9)
                    }
                })
                setUploadFileList(FileListData)
            }
        }
    }
    const cancel = () => {
        navigate(-1)
        // navigate(`/project-detail?id=${searchId}`);
    }
    const submit = async () => {
        let verify = [
            [CalendarTime === '', '请选择对接时间'],
            [params.jointItem === '', '对接事项不能为空'],
            [params.jointStatus === '', '对接状态不能为空'],
            [params.governmentContacts === '', '政府对接人不能为空'],
            [params.governmentContactsPhone === '', '政府对接人手机不能为空'],
            [params.jointContacts === '', '企业联系人不能为空'],
            [params.jointContactsPhone === '', '企业联系人手机不能为空'],
            [params.jointContactsPost === '', '企业联系人职务不能为空'],
            [params.isJointLeader === '', '请选择是否洽谈对接领导'],
            [params.isJointLeader == 1 && cityLeaders.tags.length === 0 && districtLeaders.tags.length === 0 && bureauLeaders.tags.length === 0, '请添加对接领导人'],
            [params.isSecretProject === '', '请选择是否保密项目'],
            [params.nextStep === '', '请选择下一步安排'],
            [params.nextStep == 1 && expectSettleTime === '', '请选择预计落户时间'],
            ...(params.nextStep == 2 ? [
                [params.registerType === '', '请选择落地注册类型'],
                ...(params.registerType == 1 ? [
                    [params.creditCode === '', '注册企业统一社会信用代码不能为空'],
                    [settleTime === '', '请选择落户时间'],
                ] : []),
                ...(params.registerType == 2 ? [
                    [params.settledType === '', '请选择无注册实体类型'],
                    [params.houseTime === '', '请选择购房时间'],
                    // [uploadFileList.length === 0,'请上传请补充租房/购房协议、产业联席会会议资料等'],
                ] : []),
            ] : []),
            [params.nextStep == 3 && params.stopReason, '终止原因不能为空'],
        ]
        for (let i = 0; i < verify.length; i++) {
            if (verify[i][0]) {
                return Toast.show({ content: verify[i][1] })
            }
        }
        let supportProveAnnexName: any = []
        let supportProveAnnexUrl: any = []
        uploadFileList.map((item: any) => {
            supportProveAnnexName.push(item.name)
            supportProveAnnexUrl.push(item.url)
        })
        if (params?.nextStep == 2) {
            const { natong, productionOperation, enteringOffice } = params
            let jointStatus:any = params?.jointStatus
            if(!!natong && !params?.jointStatus?.includes('19') && !params?.jointStatus?.includes('20')) {
                jointStatus?.push(natong)
            }
            if(!!productionOperation && !params?.jointStatus?.includes('17') && !params?.jointStatus?.includes('18')) {
                jointStatus?.push(productionOperation)
            }
            if(!!enteringOffice && !params?.jointStatus?.includes('15') && !params?.jointStatus?.includes('16')) {
                jointStatus?.push(enteringOffice)
            }
        }
        let query: any = {
            ...params,
            ...(infoId && { id: infoId }),
            investPurposeInfoId: searchId,
            jointStatus: params?.jointStatus?.toString(),
            supportProveAnnexName: supportProveAnnexName.toString(),
            supportProveAnnexUrl: supportProveAnnexUrl.toString(),
            jointDate: CalendarTime,
            expectSettledTime: expectSettleTime,
            ...(params.isJointLeader == 1 && {
                jointLeader1: cityLeaders.tags.toString(),
                jointLeader2: districtLeaders.tags.toString(),
                jointLeader3: bureauLeaders.tags.toString(),
            }),
            ...([1, 2].includes(params.registerType) && {
                settledBuyHouseTime: params.registerType == 1 ? settleTime : houseTime
            })
        }
        delete query?.natong
        delete query?.productionOperation
        delete query?.enteringOffice
        let res: any = await negotiationAdd(query)
        const { code, msg } = res?.data
        if (code == 0) {
            navigate(-1)
            // navigate(`/project-detail?id=${searchId}`);
        }
        Toast.show({ content: msg })
    }
    useEffect(() => {
        infoId && getHandleInfoData()
    }, [])

    const dockingStatus2: any = [ // 初步对接-转深入洽谈和深入洽谈-保持深入洽谈的对接状态
        { name: '接触非实控人', id: '1' },
        { name: '接触实控人', id: '2' },
        { name: '组建项目专班', id: '6' },
        { name: '形成落户方案', id: '7' },
        { name: '政策匹配', id: '8' },
        { name: '选定办公地址', id: '9' },
        { name: '签署合作协议/合作备忘录', id: '10' },
    ]

    const dockingStatus3: any = [ // 深入洽谈-转落地注册的对接状态
        // { name: '新注册', id: '11' },
        // { name: '区外迁入', id: '12' },
        { name: '虚拟地址入驻', id: '13' },
        { name: '签订落户协议', id: '14' },
    ]

    const dockConfig: any = { 1: dockingStatus2, 2: dockingStatus3, 3: dockingStatus2 }

    return (<>
        <div className={Styles.Baseinfo}>
            <div className={Styles.blockItem}>
                <div className={Styles.BaseinfoTitle}>深入洽谈记录</div>
                <div className={Styles.BaseinfoBlock}>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>对接时间：</div>
                        <div className={Styles.BaseinfoInput} onClick={() => { showPopup(true) }}>
                            <div className={Styles.BaseinfoText}>{CalendarTime || '请选择'}</div>
                            <CalendarPopup vis={CalendarPopupVis} showPopup={showPopup} enterDate={enterDate} />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>对接事项：</div>
                        <div className={Styles.BaseinfoInput}>
                            <TextArea
                                placeholder='请输入'
                                value={params.jointItem}
                                onChange={val => {
                                    changeParams(val, 'jointItem')
                                }}
                            />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>对接状态：</div>
                        <div className={Styles.BaseinfoStatus}>
                            <Checkbox.Group value={params?.jointStatus} onChange={val => {
                                changeParams(val, 'jointStatus')
                            }}>
                                {dockConfig?.[params?.nextStep || 1].map((item: any) => (
                                    <Checkbox value={item.id} key={item.id}>
                                        {item.name}
                                    </Checkbox>
                                ))}
                            </Checkbox.Group>
                        </div>
                    </div>
                    {params?.nextStep == 2 && <>
                        <div className={Styles.BaseinfoItem}>
                            <div className={Styles.normalKey}>以下状态若勾选，仅可二选一：</div>
                            <div className={Styles.BaseinfoInput}>
                                <Radio.Group value={params.enteringOffice} onChange={(e) => {
                                    setParams((value: any) => {
                                        value.enteringOffice = e
                                        return { ...value }
                                    })
                                }}>
                                    <div className={Styles.CheckboxItem}>
                                        1、<Radio value={15}></Radio>暂未入驻办公
                                    </div>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={16}></Radio>已入驻办公
                                    </div>
                                </Radio.Group>
                            </div>
                            <div className={Styles.BaseinfoInput}>
                                <Radio.Group value={params.productionOperation} onChange={(e) => {
                                    setParams((value: any) => {
                                        value.productionOperation = e
                                        return { ...value }
                                    })
                                }}>
                                    <div className={Styles.CheckboxItem}>
                                        2、<Radio value={17}></Radio>暂未投产运营
                                    </div>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={18}></Radio>已投产运营
                                    </div>
                                </Radio.Group>
                            </div>
                        </div>
                        <div className={Styles.BaseinfoItem}>
                            <div className={Styles.normalKey}>以下状态，落地注册审批通过后自动关联形成：</div>
                            <div className={Styles.BaseinfoInput}>
                                <Radio.Group value={params.natong} disabled={true} onChange={(e) => {
                                    setParams((value: any) => {
                                        value.natong = e
                                        return { ...value }
                                    })
                                }}>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={19}></Radio>暂未入库纳统
                                    </div>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={20}></Radio>已入库纳统
                                    </div>
                                </Radio.Group>
                            </div>
                        </div>
                        <div className={Styles.BaseinfoItem}>
                            <div className={Styles.BaseinfoKey}>政府对接人：</div>
                            <div className={Styles.BaseinfoInput}>
                                <Input
                                    placeholder='请输入'
                                    value={params.governmentContacts}
                                    onChange={val => {
                                        changeParams(val, 'governmentContacts')
                                    }}
                                />
                            </div>
                        </div>
                    </>}
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>政府对接人手机：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Input
                                placeholder='请输入'
                                value={params.governmentContactsPhone}
                                onChange={val => {
                                    changeParams(val, 'governmentContactsPhone')
                                }}
                            />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>企业联系人：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Input
                                placeholder='请输入'
                                value={params.jointContacts}
                                onChange={val => {
                                    changeParams(val, 'jointContacts')
                                }}
                            />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>企业联系人手机：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Input
                                placeholder='请输入'
                                value={params.jointContactsPhone}
                                onChange={val => {
                                    changeParams(val, 'jointContactsPhone')
                                }}
                            />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>企业联系人职务：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Input
                                placeholder='请输入'
                                value={params.jointContactsPost}
                                onChange={val => {
                                    changeParams(val, 'jointContactsPost')
                                }}
                            />
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>是否洽谈对接领导：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Radio.Group value={params.isJointLeader} onChange={(e) => {
                                setParams((value: any) => {
                                    value.isJointLeader = e
                                    return { ...value }
                                })
                            }}>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={0}></Radio>未对接
                                </div>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={1}></Radio>已对接
                                </div>
                            </Radio.Group>
                        </div>
                    </div>
                    {params.isJointLeader == 1 && <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>对接人领导(类型及姓名)：</div>
                        <div className={Styles.BaseinfoInput}>
                            <div className={Styles.leaderLabel}>市领导</div>
                            <div className={Styles.tags}>
                                {cityLeaders.tags.map((item: any, index: any) => {
                                    return <div className={Styles.tagsItem} onClick={() => deleteLeaders(item, 'city')} key={index}>{item}<CloseOutline /></div>
                                })}
                                {cityLeaders.add && <div className={Styles.tagsAdd} onClick={() => { showTagsInput('city') }}><AddOutline />添加</div>}
                                {!cityLeaders.add && <Input
                                    className={Styles.tagsInput}
                                    placeholder='请输入'
                                    value={cityLeaders.value}
                                    onBlur={() => blurLeaders('city')}
                                    onChange={val => { changeTagInput(val, 'city') }}
                                />}
                            </div>
                        </div>
                        <div className={Styles.BaseinfoInput}>
                            <div className={Styles.leaderLabel}>区领导</div>
                            <div className={Styles.tags}>
                                {districtLeaders.tags.map((item: any, index: any) => {
                                    return <div className={Styles.tagsItem} onClick={() => deleteLeaders(item, 'district')} key={index}>{item}<CloseOutline /></div>
                                })}
                                {districtLeaders.add && <div className={Styles.tagsAdd} onClick={() => { showTagsInput('district') }}><AddOutline />添加</div>}
                                {!districtLeaders.add && <Input
                                    className={Styles.tagsInput}
                                    placeholder='请输入'
                                    value={districtLeaders.value}
                                    onBlur={() => blurLeaders('district')}
                                    onChange={val => { changeTagInput(val, 'district') }}
                                />}
                            </div>
                        </div>
                        <div className={Styles.BaseinfoInput}>
                            <div className={Styles.leaderLabel}>局领导</div>
                            <div className={Styles.tags}>
                                {bureauLeaders.tags.map((item: any, index: any) => {
                                    return <div className={Styles.tagsItem} onClick={() => deleteLeaders(item, 'bureau')} key={index}>{item}<CloseOutline /></div>
                                })}
                                {bureauLeaders.add && <div className={Styles.tagsAdd} onClick={() => { showTagsInput('bureau') }}><AddOutline />添加</div>}
                                {!bureauLeaders.add && <Input
                                    className={Styles.tagsInput}
                                    placeholder='请输入'
                                    value={bureauLeaders.value}
                                    onBlur={() => blurLeaders('bureau')}
                                    onChange={val => { changeTagInput(val, 'bureau') }}
                                />}
                            </div>
                        </div>
                    </div>}
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>是否保密项目：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Radio.Group value={params.isSecretProject} onChange={(e) => {
                                setParams((value: any) => {
                                    value.isSecretProject = e
                                    return { ...value }
                                })
                            }}>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={1}></Radio>是
                                </div>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={0}></Radio>否
                                </div>
                            </Radio.Group>
                        </div>
                    </div>
                    <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>下一步安排：</div>
                        <div className={Styles.BaseinfoInput}>
                            <Radio.Group value={params.nextStep} onChange={(e) => { changeNext(e) }}>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={1}></Radio>继续对接
                                </div>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={2}></Radio>转为落地注册
                                </div>
                                <div className={Styles.CheckboxItem}>
                                    <Radio value={3}></Radio>终止
                                </div>
                            </Radio.Group>
                        </div>
                    </div>
                    {params.nextStep == 1 && <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>预计落户时间：</div>
                        <div className={Styles.BaseinfoInput} onClick={() => { showExpectSettlePopup(true) }}>
                            <div className={Styles.BaseinfoText}>{expectSettleTime || '请选择'}</div>
                            <DatePopup vis={expectSettleVis} showPopup={showExpectSettlePopup} enterDate={enterExpectSettle} />
                        </div>
                    </div>}
                    {params.nextStep == 2 && <>
                        <div className={Styles.BaseinfoItem}>
                            <div className={Styles.BaseinfoKey}>落地注册类型：</div>
                            <div className={Styles.BaseinfoInput}>
                                <Radio.Group value={params.registerType} onChange={(e) => { changeRegtype(e) }}>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={1}></Radio>有注册实体
                                    </div>
                                    <div className={Styles.CheckboxItem}>
                                        <Radio value={2}></Radio>无注册实体
                                    </div>
                                </Radio.Group>
                            </div>
                        </div>
                        {params.registerType == 1 && <>
                            <div className={Styles.BaseinfoItem}>
                                <div className={Styles.BaseinfoKey}>注册企业统一社会信用代码：</div>
                                <div className={Styles.BaseinfoInput}>
                                    <Input
                                        placeholder='请输入注册企业统一社会信用代码'
                                        value={params.creditCode}
                                        onChange={val => {
                                            changeParams(val, 'creditCode')
                                        }}
                                    />
                                </div>
                            </div>
                            <div className={Styles.BaseinfoItem} onClick={() => { showSettlePopup(true) }}>
                                <div className={Styles.BaseinfoKey}>落户时间：</div>
                                <div className={Styles.BaseinfoInput}>
                                    <div className={Styles.BaseinfoText}>{settleTime || '请选择'}</div>
                                    {/* <DatePopup vis={settleVis} showPopup={showSettlePopup} enterDate={enterSettle}/> */}
                                    <CalendarPopup vis={settleVis} showPopup={showSettlePopup} enterDate={enterSettle} />
                                </div>
                            </div>
                        </>}
                        {params.registerType == 2 && <>
                            <div className={Styles.BaseinfoItem}>
                                <div className={Styles.BaseinfoKey}>无注册实体类型：</div>
                                <div className={Styles.BaseinfoInput}>
                                    <Radio.Group value={params.settledType} onChange={(e) => { changeNoRegtype(e) }}>
                                        <div className={Styles.CheckboxItem}>
                                            <Radio value={1}></Radio>购买办公用房
                                        </div>
                                        <div className={Styles.CheckboxItem}>
                                            <Radio value={2}></Radio>租赁办公用房
                                        </div>
                                    </Radio.Group>
                                </div>
                            </div>
                            <div className={Styles.BaseinfoItem}>
                                <div className={`${Styles.BaseinfoKey} ${Styles.noRequire}`}>具体面积：</div>
                                <div className={Styles.BaseinfoInput}>
                                    <Input
                                        placeholder='请输入具体面积'
                                        value={params.spaceSize}
                                        onChange={val => {
                                            changeParams(val, 'spaceSize')
                                        }}
                                    />
                                </div>
                            </div>
                            <div className={Styles.BaseinfoItem} onClick={() => { showHouseTimePopup(true) }}>
                                <div className={Styles.BaseinfoKey}>购房时间：</div>
                                <div className={Styles.BaseinfoInput}>
                                    <div className={Styles.BaseinfoText}>{houseTime || '请选择'}</div>
                                    {/* <DatePopup vis={houseVis} showPopup={showHouseTimePopup} enterDate={enterHouse}/> */}
                                    <CalendarPopup vis={houseVis} showPopup={showHouseTimePopup} enterDate={enterHouse} />
                                </div>
                            </div>
                            <div className={Styles.BaseinfoItem}>
                                <div className={Styles.BaseinfoKey}>支持证明文件：</div>
                                <div className={Styles.uploadBlock}>
                                    <div className={Styles.uploadTips}>1.请补充租房/购房协议、产业联席会会议资料等</div>
                                    <div className={Styles.uploadTips}>2.支持扩展名：.jpg .rar .zip .doc .docx .pdf，文件大小不超过10M</div>
                                    {uploadFileList.length != 0 && uploadFileList.map((upitem: any, upindex: any) => {
                                        return <div className={Styles.uploadItem} key={`file_${upindex}`}>
                                            <TextOutline />
                                            <div className={Styles.uploadItemName}>{upitem.name}</div>
                                            {/* <CloseOutline onClick={()=>{deleteUploadItem(upitem)}}/> */}
                                        </div>
                                    })}
                                    <label className={Styles.uploadAdd}>
                                        <input type="file" name="fileContent" ref={upLoadRef} hidden onChange={(e) => { inputUploadFile(e) }} />
                                        <UploadOutline />上传文件
                                    </label>
                                </div>
                            </div>
                        </>}
                    </>}
                    {params.nextStep == 3 && <div className={Styles.BaseinfoItem}>
                        <div className={Styles.BaseinfoKey}>终止原因：</div>
                        <div className={Styles.BaseinfoInput}>
                            <TextArea
                                placeholder='请输入终止原因'
                                value={params.stopReason}
                                onChange={val => {
                                    changeParams(val, 'stopReason')
                                }}
                            />
                        </div>
                    </div>}
                </div>
            </div>
            <div className={Styles.submitBtn}>
                <div className={Styles.btnCancel} onClick={() => cancel()}>取消</div>
                <div className={Styles.btnEnter} onClick={() => submit()}>确认</div>
            </div>
        </div>
    </>)
}
export default Index;